<template>
    <transition name="page-transition-slide-in-right">
        <div class="city-cascader-panel__body-panel" v-show="show">
            <ask-city-panel
                name="CityPanel"
                v-bind="$props"
                :list="list"
                :loader="ajaxLoader"
                @item-active="handleItemActive"
                ref="askCityPanelRef"
            ></ask-city-panel>
        </div>
    </transition>
</template>
<script lang="ts">
import {
    Component,
    Mixins
} from "vue-property-decorator";

import cityMixin from "./mixin";

@Component({
    name: "CityPanel"
})
export default class CityPanel extends Mixins(cityMixin) {
    handleItemActive(item: any) {
        this.$emit("item-active", "city", item);
    }
}
</script>
